<%@ page import="java.util.List" %>
<%@ page import="com.homestay.beans.Vip" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>会员列表</title>
    <link rel="stylesheet" href="/static/common/layui/css/layui.css">
    <link rel="stylesheet" href="/static/admin/css/style.css">
    <script src="/static/common/layui/layui.js"></script>
    <script src="/static/common/jquery-3.3.1.min.js"></script>
    <script src="/static/common/vue.min.js"></script>
    <style>
        #container {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        #search1, #search2, #search3 {
            display: flex;
            align-items: center;
            width: 380px;
        }

        .search-label {
            white-space: nowrap;
            margin-right: 10px;
            flex-shrink: 0;
        }

        .search-input {
            flex: 1;
        }
    </style>
</head>
<body>
<div id="app1234">
    <!--顶栏-->
    <%@include file="/views/top.jsp"%>

    <div class="main" id="app">
        <!--左栏-->
        <div class="left">
            <ul class="cl">
                <!--顶级分类-->
                <li v-for="vo,index in menu" :class="{hidden:vo.hidden}">
                    <a href="javascript:;" :class="{active:vo.active}" @click="onActive(index)">
                        <i class="layui-icon" v-html="vo.icon"></i>
                        <span v-text="vo.name"></span>
                        <i class="layui-icon arrow" v-show="vo.url.length==0">&#xe61a;</i> <i v-show="vo.active"
                                                                                              class="layui-icon active">&#xe623;</i>
                    </a>
                    <!--子级分类-->
                    <div v-for="vo2,index2 in vo.list">
                        <a href="javascript:;" :class="{active:vo2.active}" @click="onActive(index,index2)"
                           v-text="vo2.name"></a>
                        <i v-show="vo2.active" class="layui-icon active">&#xe623;</i>
                    </div>
                </li>
            </ul>
        </div>
        <!--右侧-->
        <div class="right">
            <div class="layui-row">
                <fieldset class="layui-elem-field layui-field-title">
                    <legend>会员列表</legend>
                </fieldset>
                <%-- 搜索--%>
                <form method="post" action="/vip?action=query">
                    <div class="layui-col-lg4" style="float: right" id="container">
                        <%--<div>--%>
                        <%--    <span style="color: red; font-weight: bold" > &nbsp;${error}</span>--%>
                        <%--</div>--%>

                            <div class="layui-input-inline" id="search1">
                                <span class="search-label">姓名：</span>
                                <input type="text" name="name" value="<%=request.getAttribute("name")%>"
                                       placeholder="输入姓名进行查询" class="layui-input key search-input">
                            </div>

                            <div class="layui-input-inline" id="search2">
                                <span class="search-label">身份证号：</span>
                                <input type="text" name="card" value="<%=request.getAttribute("card")%>"
                                       placeholder="输入身份证号进行查询" class="layui-input key search-input">
                            </div>

                            <div class="layui-input-inline" id="search3">
                                <span class="search-label">手机号：</span>
                                <input type="text" name="phone" value="<%=request.getAttribute("phone")%>"
                                       placeholder="输入手机号进行查询" class="layui-input key search-input">
                            </div>

                            <div>
                                <button type="submit" class="layui-btn layui-btn-warm" style="width: 100px">查询</button>
                            </div>
                    </div>
                </form>
            </div>

            <%-- 表格 --%>
            <table class="layui-table layui-form">

                <thead>
                <tr>
                    <th>编号</th>
                    <th>姓名</th>
                    <th>性别</th>
                    <th>身份证号</th>
                    <th>手机号</th>
                    <th>会员级别</th>
                    <th>开通时间</th>
                    <th>到期时间</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>

                <c:forEach items="${requestScope.vips}" var="vip">
                    <tr class="id36567">
                        <td>${vip.id}</td>
                        <td style="font-family: 宋体;font-weight: bold">${vip.name}</td>
                        <td>${vip.sex}</td>
                        <td>${vip.card}</td>
                        <td>${vip.phone}</td>
                        <td>${vip.v_type}</td>
                        <td>${vip.startTime}</td>
                        <td>${vip.endTime}</td>
                        <td>
                            <a href="javascript: if(window.confirm('是否确认删除？')){window.location.href='/vip?action=delete&id=${vip.id}'}">删除</a>&nbsp;&nbsp;|&nbsp;&nbsp;
                            <a href="/vip?action=goupdate&id=${vip.id}"> 修改</a></td>
                        </td>
                    </tr>
                </c:forEach>


                </tbody>
            </table>

        </div>
    </div>
</div>

<script>
    $("td:contains('初级会员')").css("color", "rgb(8,57,163)");
    $("td:contains('中级会员')").css("color", "rgba(230,148,20,0.93)");
    $("td:contains('高级会员')").css("color", "#e52b1b");
    $("td:contains('至尊会员')").css("color", "#d100ff");
</script>

<script src="/static/admin/js/config.js"></script>
<script src="/static/admin/js/script.js"></script>
</body>
</html>
